<template>
  <view class="diy-item">
    <!-- 页面头部组件 -->
    <pageHeader
      v-if="params.comName == 'pageHeader'"
      :propsData="params"
      :page="page"
      :reloadHeader="reloadHeader"
      ref="pageHeader"
      :cash="cash"
    ></pageHeader>
    <!-- 搜索组件 -->
    <diySearch
      v-if="params.comName == 'diySearch'"
      :propsData="params"
    ></diySearch>
    <!-- 轮播图 -->
    <swiperImg
      v-if="params.comName == 'swiperImg'"
      :propsData="params"
    ></swiperImg>
    <!-- 视频组件 -->
    <!-- #ifndef APP-PLUS -->
    <diyVideo
      v-if="params.comName == 'diyVideo'"
      :propsData="params"
    ></diyVideo>
    <!-- #endif -->
    <!-- #ifdef APP-PLUS -->
    <appVideo
      v-if="params.comName == 'diyVideo'"
      :propsData="params"
    ></appVideo>
    <!-- #endif -->
    <!-- 快捷导航 -->
    <fastNav v-if="params.comName == 'fastNav'" :propsData="params"></fastNav>
    <!-- 首页推荐 -->
    <indexRecommend
      v-if="params.comName == 'indexRecommend'"
      :propsData="params"
    ></indexRecommend>
    <!-- 公告 -->
    <diyNotice
      v-if="params.comName == 'diyNotice'"
      :propsData="params"
    ></diyNotice>
    <!-- 专题 -->
    <diyTopic
      v-if="params.comName == 'diyTopPic'"
      :propsData="params"
    ></diyTopic>
    <!-- 优惠券 -->
    <diyCoupon
      v-if="params.comName == 'marketCoupon'"
      :propsData="params"
    ></diyCoupon>
    <!-- 商品展示 -->
    <productShow
      v-if="params.comName == 'productShow'"
      :propsData="params"
    ></productShow>
    <!-- 商品分类 -->
    <productClassify
      v-if="params.comName == 'productClassify'"
      :propsData="params"
      :loadMoreProductClassify="loadMoreProductClassify"
      @classifyToTop="classifyToTop"
    ></productClassify>

    <!-- 团购活动 -->
    <groupBuyingClassify
      v-if="params.comName == 'mdGroupActivity' && single == 0"
      :propsData="params"
      :loadMoreProductClassify="loadMoreProductClassify"
      @classifyToTop="classifyToTop"
    ></groupBuyingClassify>

    <!-- 魔方导航 -->
    <cubeNav v-if="params.comName == 'cubeNav'" :propsData="params"></cubeNav>
    <!-- 倒计时 -->
    <countDown
      v-if="params.comName == 'marketCountDown'"
      :propsData="params"
    ></countDown>
    <!-- 自由容器 -->
    <container
      v-if="params.comName == 'container'"
      :propsData="params"
    ></container>
    <!-- 酒店搜索 -->
    <hotelSearch
      v-if="params.comName == 'hotelSearch'"
      :propsData="params"
      :locaton="location"
    ></hotelSearch>
    <!-- 积分商品 -->
    <integralProduct
      v-if="params.comName == 'integralProduct'"
      :propsData="params"
      :loadMoreProductClassify="loadMoreProductClassify"
    ></integralProduct>
    <!-- 秒杀商品 -->
    <goodSeckill
      v-if="params.comName == 'productSeckill'"
      :propsData="params"
    ></goodSeckill>
    <!-- 新人专享 -->
    <newUser
      ref="newUser"
      v-if="params.comName == 'newUser'"
      :propsData="params"
    ></newUser>
    <!-- 新人专享券 -->
    <newUserCoupon
      ref="newUserCoupon"
      v-if="params.comName == 'newUserCoupon'"
      :propsData="params"
    ></newUserCoupon>
    <!-- 点餐 -->
    <orderingFood
      v-if="params.comName == 'orderingFood'"
      :propsData="params"
      :loadMoreProductClassify="loadMoreProductClassify"
      @classifyToTop="classifyToTop"
    ></orderingFood>
    <!-- 商品展示 -->
    <serviceHome
      v-if="['serviceHome', 'bookingHome'].includes(params.comName)"
      :propsData="params"
      :product_type="getProductType(params.comName)"
    ></serviceHome>
    <ptProductShow
      v-if="params.comName == 'ptProductShow'"
      :propsData="params"
    ></ptProductShow>
    <diyImages v-if="params.comName == 'images'" :propsData="params">
    </diyImages>
  </view>
</template>

<script>
import pageHeader from "./pageHeader/index.vue";
import diySearch from "./diySearch/index.vue";
import swiperImg from "./swiperImg/index.vue";
import diyVideo from "./diyVideo/index.vue";
import appVideo from "./diyVideo/appVideo.vue";
import fastNav from "./fastNav/index.vue";
import indexRecommend from "./indexRecommend/index.vue";
import diyNotice from "./diyNotice/index.vue";
import diyTopic from "./diyTopic/index.vue";
import diyCoupon from "./diyCoupon/index.vue";
import productShow from "./productShow/index.vue";
import goodSeckill from "./goodSeckill/index.vue";

import groupBuyingClassify from "./groupBuyingClassify/index.vue";

import productClassify from "./productClassify/index.vue";
import cubeNav from "./cubeNav/index.vue";
import countDown from "./countDown/index.vue";
import container from "./container/index.vue";
import hotelSearch from "./hotelSearch/index.vue";
import integralProduct from "./integralProduct/index.vue";
import newUser from "./newUser/index.vue";
import newUserCoupon from "./newUserCoupon/index.vue";
import orderingFood from "./orderingFood/index.vue";
import serviceHome from "./serviceHome/index.vue";
import ptProductShow from "./ptProductShow/index.vue";
import diyImages from "./diyImages/index";

import { diyMixin } from "./mixins/diy";

export default {
  props: {
    params: {
      type: Object,
      default: () => {
        return {};
      }
    },
    location: {
      default: () => {
        return {};
      }
    },
    page: {
      type: Object,
      default: {}
    },
    reloadHeader: {
      type: Boolean,
      default: false
    },
    loadMoreProductClassify: {
      type: Boolean,
      default: false
    },
    cash: {
      type: Number,
      default: false
    }
  },
  components: {
    pageHeader,
    diySearch,
    swiperImg,
    diyVideo,
    fastNav,
    indexRecommend,
    diyNotice,
    diyTopic,
    diyCoupon,
    productShow,
    goodSeckill,
    productClassify,
    cubeNav,
    countDown,
    container,
    appVideo,
    hotelSearch,
    integralProduct,
    newUser,
    newUserCoupon,
    orderingFood,
    serviceHome,
    ptProductShow,
    diyImages,
    groupBuyingClassify
  },
  mixins: [diyMixin], //混入文件
  data() {
    return {};
  },

  computed: {
    getProductType() {
      return (comName) => {
        let product_type = 1;

        switch (comName) {
          case "serviceHome":
            product_type = 6;
            break;

          case "bookingHome":
            product_type = 2;
            break;

          default:
            break;
        }
        return product_type;
      };
    },
    // 独立运营隐藏团购活动
    single() {
      if (uni.getStorageSync("storeMdData")) {
        let isSingle = uni.getStorageSync("storeMdData");
        let isSingleObj = JSON.parse(isSingle);
        return isSingleObj.is_single || 1;
      } else {
        return 1;
      }
    }
  },

  methods: {
    classifyToTop(e) {
      this.$emit("classifyToTop", e);
    },
    init(el) {
      this.$nextTick(() => {
        if (this.$refs.newUserCoupon) {
          this.$refs.newUserCoupon.init();
        }

        if (this.$refs.pageHeader) {
          this.$refs.pageHeader.initMdData();
        }
      });
    }
  }
};
</script>

<style scoped lang="scss">
.page-header {
  width: 100%;
  height: 128rpx;
  background-color: #fa2c1b;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 511;
  .header-content {
    width: 92%;
    font-size: 36rpx;
    font-weight: 600;
    color: #ffffff;
    text-align: center;
    position: absolute;
    left: 4%;
    top: 0;
    z-index: 11;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
.hold-place {
  width: 100%;
  height: 128rpx;
}
</style>
